<template>
<div>
  <h1>商品展示</h1>
  <table>
    <tr>
      <td>商品名</td>
      <td>价格</td>
      <td>展示</td>
      <td>操作</td>
    </tr>
    <tr v-for="i in list">
      <td>{{i.name}}</td>
      <td>{{i.price}}</td>
      <td><img :src="'http://127.0.0.1:8000'+i.pic" alt="" width="200px"></td>
      <td>
        <button @click="add(i.id)">购买</button>
      </td>
    </tr>
  </table>
</div>
</template>

<script>
export default {
  name: "goods",
  data(){
    return{
      list:[],
      user:localStorage.getItem('userid')
    }
  },
  methods:{
    show(){
      this.$axios.get('users/Ugoods_API/')
      .then(i=>{
        this.list = i.data.list
      })
    },
    add(id){
      let from = new FormData()
      from.append('user',this.user)
      from.append('goods',id)
      this.$axios.post('users/UorderList_API/',from)
      .then(i=>{
        if (i.data.code ==200){
          this.$router.push({path:'/shop'})
        }
      })
    }
  },
  mounted() {
    this.show()
  }
}
</script>

<style scoped>

</style>
